import React, { Component } from "react";
import './Wofuzwderenwu.less'
import api from "./../../api";
import axios from "./../../utils/axios";
import { Button, Form, Input, Table, DatePicker, Space } from "antd";
const layout = {
  labelCol: {
    span: 8,
  },
  wrapperCol: {
    span: 16,
  },
};
export default class Yiguidangrenwu extends Component {
  constructor(props) {
    super(props);
    this.onChange = this.onChange.bind(this);
    this.state = {
      task_id: "",
      task_name: "",
      creator: "",
      principal:"",
      currentPage:"",
      pageSize:"",
      finish_date:"",
      filing_date:"",
      addvisble:true,
      data: [],
    };
    this.del=this.del.bind(this)
  }
  romref = React.createRef();
  formRef = React.createRef();
//  数据初始化
  componentDidMount() {
    let {currentPage,pageSize}=this.state;
    axios({
      url:api.Get_yiguidangderenwu,
      params:{currentPage,pageSize}
    }).then(res=>{
      if (res.data.code === 200) {
              this.setState({
                data: res.data.data,
              });
            }
            if(res.data.code===404){
              this.error("找不到文件路径")
            }
            if (res.data.code === 500) {
              this.error("数据库出错");
            }
          }).catch((err) => {
            console.log("数据出错", err);
    }).catch(error=>{
      console.log(error);
    })
  }
  onReset = () => {
    this.formRef.current.resetFields();
  };
  onChange = (e) => {
    e.preventDefault()
    console.log("value", e.target.value);
    let key = e.target.dataset.key;
    this.setState({ [key]: e.target.value });
  };
   // 删除
   del(index){
    let {task_id}=this.state
    
    const data = [...this.state.data];
    data.splice(index,1)
    this.setState({
      data
    })
  }



  render(index) {
    const columns = [
      {
        title: "序号",
        dataIndex: "task_id",
        key: "task_id",
        fixed: "true",
        align: "center",
      },
      {
        title: "任务名称",
        dataIndex: "task_name",
        key: "task_name",
        align: "center",
      },
      
      {
        title: "创建时间",
        dataIndex: "create_date",
        key: "create_date",
        align: "center",
      },
      {
        title: "创建人",
        dataIndex: "creator",
        key: "creator",
        align: "center",
      },
      {
        title: "负责人",
        dataIndex: "principal",
        key: "principal",
        align: "center",
      },
      {
        title: "完成日期",
        dataIndex: "finish_date",
        key: "finish_date",
        align: "center",
      },
      {
        title: "归档时间",
        dataIndex: "filing_date",
        key: "filing_date",
        align: "center",
      },
      
      {
        title: "操作",
        key: "operation",
        fixed: "true", 
        render: () => 
        <>
        <span className="actions" onClick={()=>this.del(index)}>删除</span>
        </>,
        align: "center",
        
      },
    ];
    return (
      <>
        <Form
          {...layout} ref={this.formRef} name="control-ref"  onFinish={this.onFinish} >
          <Form.Item name="task_name" label="任务名称">
            <Input />
          </Form.Item>
          <Form.Item name="filing_date" label="完成时间">
            <Space direction="vertical">
              <DatePicker placeholder="" />
            </Space>
          </Form.Item>
          <Form.Item>
          </Form.Item>
        </Form>
         <div className="ant-btn-block">
            <Button type="primary" htmlType="submit">查询</Button>
            <Button htmlType="button" onClick={this.onReset}>重置</Button>
            </div>
      <Table columns={columns} dataSource={this.state.data} scroll={{}} rowKey={record => record.task_id 
           
           } />
      </>
    );
  }
}